<template>
	<view class="login">
		<!-- <cu-custom class="bg1" :isBack="false">
			<block slot="content">登陆</block>
		</cu-custom> -->
		<view class="content">
			<!-- 头部logo -->
			<view class="header">
				<image src="../../static/boy.png"></image>
				<!-- <image :src="logoImage"></image> -->
			</view>
			<!-- 主体表单 -->
			<view class="main">
				<wInput v-model="userBs" type="text" placeholder="用户标识"></wInput>
				<!-- <view class="cu-form-group" v-if='BillName!="采购订单"&&BillName!="促销单"'>
					<view class="title">*客&emsp;&nbsp;&nbsp;户&nbsp;:</view>
					<view class="inpt1"><input type="text" placeholder="点击获取" :value="SelectClientObj.ClientName" disabled="true"
						 style="text-align: left;"  /></view>
				</view> -->
				<wInput v-model="SelectOperatorObj.User_Name" type="text" maxlength="11" placeholder="用户名/电话/编号" @onTap="onTap"
				 :disable="true"></wInput>
				<wInput v-model="SelectOperatorObj.User_Pw" type="password" maxlength="11" placeholder="密码"></wInput>
				<!-- 保存密码-->
				<view class="remember" @tap="RemeberPsw()">
					<image class="remember-image" src="../../static/xuan.png" mode="aspectFill" v-if="agree"></image>
					<image class="remember-image" src="../../static/xuan2.png" mode="aspectFill" v-else></image>
					<text class="remember-text" >记住密码</text>
				</view>
			</view>
			<wButton text="登 录" :rotate="isRotate" @click.native="startLogin()"></wButton>
			<!-- 底部信息 -->
			<view class="footer">
				<navigator url="register" open-type="navigate">注册账号</navigator>
				<!-- <text>|</text>
				<navigator url="forget" open-type="navigate">连接设置</navigator> -->
			</view>
		</view>
		<view class="cu-modal" :class="modalName=='selectUser'?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">请选择登陆人</view>
					<view class="action" @tap="hideModal">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl">
					<view class="searchStore">
						<input placeholder="请输入登陆人名称" v-model="SearchUserName" @input="filterUser" />
						<button @tap="searchUser">搜索</button>
					</view>
					<view class="StoreListWrap">
						<view v-for="(item,index) in TempUserList" :key="index" @tap="selectUser(index)" v-if="item.IsUse!=''">{{item.User_Name}}</view>
					</view>
				</view>
				<view class="cu-bar bg-white justify-end" @tap="clear()">
					<view class="content">清空</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	var _this;
	import wInput from '../../components/watch-login/watch-input.vue' //input
	import wButton from '../../components/watch-login/watch-button.vue' //button
	import allConst from "../../Json.js"
	import * as Api from '@/syApis/syBb/apis.js'
	import * as Apis from '@/syApis/sySet/sySet.js'
	export default {
		data() {
			return {
				//logo图片 base64
				phoneData: '', //用户/电话
				passData: '', //密码
				isRotate: false, //是否加载旋转
				value: '', //值
				agree: false,
				//是否记住密码
				isRemember: false,
				// 用户标识
				userBs: "0000",
				//本地图片
				loadImg: "",
				TempUserList: [],
				UserList: [],
				SearchUserName: "",
				SelectOperatorObj: {
					OperatorName: "",
					PossWord: ""
				},
				modalName: '',
				isShowPwd:false
			};
		},
		components: {
			wInput,
			wButton,
		},
		mounted() {
			_this = this;
		},
		onLoad() {
			this.agree =  uni.getStorageSync("agree",'false') == 'false' ? true : false;
			this.isShowPwd = uni.getStorageSync("agree",'false') == 'false' ? true : false;
			console.log(uni.getStorageSync("agree",'false') == 'false',uni.getStorageSync("agree",'false'));
		},
		methods: {
			clear() {
				this.SelectOperatorObj = {
					OperatorName: "",
					PossWord: ""
				}
				this.modalName = "";
			},
			//获取登录权限设置的内容
			getSystemPowerSettingInfo() {
				let data = {};
				var that = this;
				Apis.Gain_User(data, function(res) {
					uni.hideLoading();
					if (res.state) {
						if (res.data.ErrorMsg == "获取登录信息失败") {
							Api.showTip("登录超时");
						} else if (res.data.ErrorMsg != "") {
							Api.showTip(res.data.ErrorMsg);
						} else {
							let responseData = res.data.ResultMsg;
							if (responseData.length == 0) {
								Api.showTip("查无数据");
								return;
							}
								that.UserList = responseData;
								that.TempUserList = responseData;
							
						}
						that.modalName = "selectUser";
					} else {

					}
				})
			},
			filterUser(e) {
				let tempList = [];
				this.UserList.forEach((item, index) => {
					if (item.User_Name.indexOf(e.detail.value) > -1) {
						tempList.push(item);
					}
				})
				if(tempList.length==0){
					Api.showTip("查无数据");
				}
				this.TempUserList = tempList;
			},
			searchUser() {
				let data = {
					detail: {
						value: this.SearchUserName
					}
				}
				this.filterUser(data);
			},
			selectUser(index) {
				if(this.isShowPwd){
					this.SelectOperatorObj = this.TempUserList[index];
				}else{
					// this.SelectOperatorObj = this.TempUserList[index];
					this.SelectOperatorObj.User_Name = this.TempUserList[index].User_Name;
				}
				
				this.modalName = "";
				this.SearchUserName = "";
			},
			hideModal() {
				this.modalName = "";
			},
			onTap(e) {
				uni.showLoading({
					title: "加载中..."
				})
				if (this.userBs == "") {
					uni.hideLoading();
					Api.showTip("用户标识不能为空");
				} else {
					this.startRePass();
				}
			},
			// register(){
			// 	let  data = {
			// 		    "context":{
			// 		        "_unicode":"P002",
			// 		        "_cerNo":"1164347083",
			// 		        "_productType":"产品类型/编码",
			// 		        "_companyname":"公司名称",
			// 		        "_companyAddress":"公司地址",
			// 		        "_companyContact":"联系人",
			// 		        "_companyTel":"1365543281",
			// 		        "_AgentNo":"代理编号",
			// 		        "_AgentName":"代理名称",
			// 		        "_Password":"证书密码"
			// 		    }
			// 		}

			// 	Api.hasLogins(data,function(res){
			// 		console.log(res);
			// 	})
			// },
			// chooseImage(){
			// 	var that = this;
			// 	uni.chooseImage({
			// 	    success: (chooseImageRes) => {
			// 	        const tempFilePaths = chooseImageRes.tempFilePaths;
			// 		
			// 			console.log(tempFilePaths[0]);
			// 	        uni.uploadFile({
			// 	            url: 'http://192.168.1.51:9000/api/UpLoadPicture', //仅为示例，非真实的接口地址
			// 	            filePath: tempFilePaths[0],
			// 	            name: 'picture',
			// 	            formData: {
			// 	               "Database":"FastApp",
			// 				   "AddName":"商品图片"
			// 	            },
			// 	            success: (uploadFileRes) => {
			// 					that.loadImg = "http://192.168.1.51:9000/picture/"+uploadFileRes.data.ResultMsg
			// 	                console.log(uploadFileRes.data);
			// 	            }
			// 	        });
			// 	    }
			// 	});
			// },
			startLoginConnect() {
				if (this.userBs == "") {
					Api.showTip("用户标识不能为空");
				} else {
					uni.showLoading({
						title: "登录中...",
						mask: false
					})
					this.startRePass();
				}

			},
			RemeberPsw() {
				this.agree = !this.agree;
			},
			isLogin() {
				//判断缓存中是否登录过，直接登录
				try {
					const value = uni.getStorageSync('setUserData');
					if (value) {
						//有登录信息
						console.log("已登录用户：", value);
						// _this.$store.dispatch("setUserData",value); //存入状态
						uni.reLaunch({
							url: "../index/index"
						});
					}
				} catch (e) {
					// error
				}
			},
			startRePass() {
				let ConnentUrl = "192.168.1.51";
				let ConnetPost = "9000";
				// allConst.ConnentUrl;
				uni.setStorageSync('ip', ConnentUrl);
				uni.setStorageSync('ipPost', ConnetPost);
				uni.setStorageSync('UniqueNumber', this.userBs);
				var $this = this;
				let data = {
					UniqueNumber: this.userBs
				}
				Api.settingUrl(data, function(data) {
					//连接成功
					if (data.state) {
						if (data.data.TipsMsg == "OK") {
							try {
								uni.setStorageSync('DataBaseName', data.data.ResultMsg.DataBaseName);
							} catch (e) {
								console.log(e);
							}
							$this.getSystemPowerSettingInfo();
							// $this.startLogin();
						} else if (data.data.ErrorMsg != "") {
							Api.showTip(data.data.ErrorMsg);
							uni.hideLoading();
						}
					} else {
						Api.showTip("服务器开小差了");
						uni.hideLoading();
					}
				});
				// }
			},
			startLogin() {
				//登录 
				if (this.isRotate) {
					//判断是否加载中，避免重复点击请求
					return false;
				}
				if (this.SelectOperatorObj.User_Name == 0) {
					Api.showTip("用户名不能为空");
					return;
				}
				if (this.SelectOperatorObj.User_Pw == 0) {
					Api.showTip("密码不能为空");
					return;
				}
				console.log(this.SelectOperatorObj.OperatorName);
				uni.setStorageSync("UserName", this.SelectOperatorObj.User_Name);
				if (this.isRemember) {
					uni.setStorageSync("Psw", this.SelectOperatorObj.User_Pw);
				} else {
					uni.setStorageSync("Psw", "");
				}
				var ip = uni.getStorageSync("ip");
				if (ip == "") {
					Api.showTip("您还未进行连接设置");
					return;
				}
				this.isRotate = true;
				// setTimeout(function() {
				// 	_this.isRotate = false
				// }, 3000);
				var dataBaseName = uni.getStorageSync("DataBaseName");
				let $data = {
					OperatorName: this.SelectOperatorObj.User_Name,
					PassWord: this.SelectOperatorObj.User_Pw,
					SystemType: 1,
					Database: dataBaseName
				}
				var _this = this;
				//let response = Api.settingUrl(data);
				Api.hasLogin($data, function(data) {
					//连接成功
					if (data.state) {
						uni.hideLoading();
						if (data.data.TipsMsg == "此账号已登录,是否继续登录?") {
							Api.showConfirm("您的账号已经登录,是否继续登录", function(state) {
								if (state) {
									_this.LoginuSer($data);
									// _this.isRotate = false
								} else {
									_this.isRotate = false
									Api.showTip("取消登录");
								}
							})
						} else {
							_this.LoginuSer($data);
							uni.hideLoading();
							_this.isRotate = false
						}
					} else {
						Api.showTip("服务器开小差了");
						uni.hideLoading();
						_this.isRotate = false
					}
				});
			},
			changeRememberPasswrod() {
				this.agree = !this.agree;
			},
			/**登录操作*/
			LoginuSer: function($data) {
				var that = this;
				Api.Login($data, function(res) {
					//连接成功
					if (res.state) {
						if (res.data.TipsMsg == "OK") {
							uni.setStorageSync("LoginCode", res.data.ResultMsg.LoginCode);
							uni.setStorageSync("UserCode", res.data.ResultMsg.ShopList[0].UserCode);
							Api.showTip("登录成功");
							uni.setStorageSync("agree",that.agree);
							console.log(that.agree);
							uni.setStorageSync("setUserData", true);
							setTimeout(function() {
								uni.redirectTo({
									url: "../index/index"
								})
							}, 500);
							uni.hideLoading();
						} else if (res.data.ErrorMsg != "") {
							console.log(res.data.ErrorMsg);
							Api.showTip(res.data.ErrorMsg);
							uni.hideLoading();
						}
					} else {
						Api.showTip("服务器开小差了");
					}
				});
			}
		},

	}
</script>

<style>
	@import url("../../components/watch-login/css/icon.css");
	@import url("./css/main.css");

	.bg1 {
		background-color: rgba(33, 167, 191, 0.8);
		color: #FFFFFF;
	}

	/*新加*/
	.main-list {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		height: 36upx;
		/* Input 高度 */
		color: #333333;
		padding: 32upx;
		margin-top: 24upx;
		margin-bottom: 24upx;
	}

	.img {
		width: 32upx;
		height: 32upx;
		font-size: 32upx;
	}

	.main-input {
		flex: 1;
		text-align: left;
		font-size: 28upx;
		/* line-height: 100upx; */
		padding-right: 10upx;
		margin-left: 20upx;
	}

	.vercode {
		color: rgba(0, 0, 0, 0.7);
		font-size: 24upx;
		line-height: 100upx;
	}

	.vercode-run {
		color: rgba(0, 0, 0, 0.4) !important;
	}

	.oBorder {
		border: 1rpx #E1D7F0 solid;
		border-radius: 2.5rem;
		-webkit-box-shadow: 0 0 60upx 0 rgba(43, 86, 112, .1);
		box-shadow: 0 0 60upx 0 rgba(43, 86, 112, .1);
	}

	/*记住密码*/
	.remember {
		/* justify-content: center; */
		margin-left: 5px;
		flex-direction: row;
		align-items: center;
		display: flex;
	}

	.remember-text {
		font-size: 14px;
		font-weight: 400;
		color: rgba(75, 84, 97, 1);
		opacity: 0.9;
	}

	.remember-image {
		width: 23px;
		height: 23px;
		margin-right: 5px;
	}


	/* 弹框样式 */
	.padding-xl .searchStore {
		display: flex;
		width: 100%;
		margin: auto;
		height: 45px;
		padding-top: 5px;
		font-size: 14px;
	}

	.padding-xl .searchStore input {
		flex: 1;
		height: 35px;
		border: 1px solid #CCC;
		border-top-left-radius: 5px;
		border-bottom-left-radius: 5px;
		padding-left: 10px;
	}

	.padding-xl {
		padding: 10px;

	}

	.padding-xl .searchStore button {
		font-size: 14px;
		color: #FFF;
		padding-left: 8px;
		padding-right: 8px;
		height: 35px;
		line-height: 35px;
		border-radius: 0px;
		border-top-right-radius: 5px;
		border-bottom-right-radius: 5px;
		text-align: center;
		background: rgba(124, 170, 216, 1);
	}

	.padding-xl .StoreListWrap {
		height: 250px;
		overflow: auto;
	}

	.padding-xl .StoreListWrap view {
		height: 40px;
		line-height: 40px;
		text-align: left;
		border-bottom: 1px solid #CCC;
		padding-left: 8px;
	}

	.cu-form-group {
		padding: 1px 10px !important;
		height: 40px;
		line-height: 40px;
		min-height: 40px;
	}

	/* 表头 */
	.tabHeader {
		width: 100%;
		height: 200px;
		overflow: hidden;
		position: relative;
		padding-bottom: 40px;
	}

	.tabHeader.tabHeaderMore {
		width: 100%;
		display: table;
	}

	.inpt1 {
		text-align: left;
	}

	/* 查看更多按钮 */
	.lookHeaderMore {
		width: 100%;
		position: absolute;
		bottom: 0px;
		left: 0px;
		z-index: 100;
	}

	.nowGoodCount {
		width: 100%;
		height: 40px;
		line-height: 40px;
		padding-left: 5%;
		background: #FFF;
		display: flex;
		position: fixed;
		bottom: 0px;
		left: 0px;
		border-top: 1px solid #CCC;
		z-index: 999;
		background: rgba(124, 170, 216, 1);
		color: #FFF;
	}

	.nowGoodCount view {
		flex: 1;
		box-sizing: border-box;
	}

	/* 返回顶部按钮 */
	.quiteTop {
		width: 50px;
		height: 50px;
		padding-top: 5px;
		line-height: 20px;
		background: rgba(0, 0, 0, .8);
		border-radius: 25px;
		text-align: center;
		font-size: 12px;
		position: fixed;
		bottom: 20px;
		right: 10px;
		z-index: 999;
		color: #FFF;
	}

	.picker {
		text-align: left !important;
	}

	.red {
		color: red;
	}

	.padding-xl .GoodsListWrap {
		height: 250px;
		overflow: auto;
	}

	.padding-xl .GoodsListWrap view {
		height: 40px;
		padding: 3px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 5px;
	}

	.padding-xl .GoodsListWrap view image {
		width: 40px;
		height: 40px;
	}

	.padding-xl .GoodsListWrap view text {
		flex: 1;
		height: 40px;
		line-height: 40px;
		text-align: left;
		padding-left: 10px;
		box-sizing: border-box;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}
</style>
